// 初始化属性
async function defineComponentProps() {
  let compId;
  try {
    compId = VueElement.id;
  } catch (e) {
    compId = "map";
  }
  TempSources.compId = compId;
  const componentProps = {
    interval: 2000,
    testData11: [
      {
        name: "123456",
      },
    ],
    testData222: [
      {
        name: "123456789",
      },
    ],
    tooltipImageBg: true,
    tooltipBgColor: "rgba(23, 189, 237, 0.5)",
    tooltipFontSize: 16,
    tooltipFontColor: "rgb(255,255,255)",

    mapPointData: {
      pointData: [
        { value: [118.8062, 31.9208], itemStyle: { color: "#4ab2e5" } },
        { value: [127.9688, 45.368], itemStyle: { color: "#4ab2e5" } },
        { value: [119.4543, 25.9222] },
      ],
      mapData: [
        {
          coords: [
            [118.8062, 31.9208],
            [119.4543, 25.9222],
          ],
          lineStyle: { color: "#4ab2e5" },
        },
        {
          coords: [
            [127.9688, 45.368],
            [119.4543, 25.9222],
          ],
          lineStyle: { color: "#4fb6d2" },
        },
      ],
    },
  };
  console.log("componentProps", componentProps.mapPointData.pointData);
  // componentProps.mapInfo = {
  //     "dataType": 1,
  //     "mapName": "广州市",
  //     "url": "",
  //     "mapCode": "440100"
  // }
  componentProps.mapInfo = {
    dataType: 1,
    mapName: "全国",
    url: "",
    mapCode: "100000",
  };
  // var points = componentProps.mapPointData.pointData;
  let option = {
    backgroundColor: "",
    geo: {
      map: TempSources.compId,
      aspectScale: 0.75, //长宽比
      tooltip: {
        show: true,
      },
      zoom: 1.1,
      zIndex: 99,
      roam: true,
      itemStyle: {
        normal: {
          borderColor: "rgb(147, 235, 248)",
          borderWidth: 1,
          areaColor: {
            type: "radial",
            x: 0.5,
            y: 0.5,
            r: 0.8,
            colorStops: [
              {
                offset: 0,
                color: "rgba(9,19,44,1)", // 0% 处的颜色
              },
              {
                offset: 1,
                color: "rgba(39,77,104,1)", // 100% 处的颜色
              },
            ],
            globalCoord: true, // 缺省为 false
          },
        },
        emphasis: {
          areaColor: "rgb(46,229,206)",
          //    shadowColor: 'rgb(12,25,50)',
          borderWidth: 0.1,
        },
      },
      label: {
        normal: {
          show: true,
          textStyle: {
            fontSize: 16,
            color: "rgba(29,233,182,1)",
          },
        },
        emphasis: {
          textStyle: {
            color: "rgb(183,185,14)",
          },
        },
      },
      regions: [
        {
          name: "南海诸岛",
          itemStyle: {
            areaColor: "rgba(0, 10, 52, 1)",

            borderColor: "rgba(0, 10, 52, 1)",
            normal: {
              // opacity: 0,
              label: {
                show: false,
                color: "rgba(0,156,201,1)",
              },
            },
          },
        },
      ],
    },
    series: [
      {
        type: "effectScatter",
        coordinateSystem: "geo",
        showEffectOn: "render",
        zlevel: 1,
        rippleEffect: {
          period: 15,
          scale: 4,
          brushType: "fill",
        },
        hoverAnimation: true,
        label: {
          normal: {
            formatter: "{b}",
            position: "right",
            offset: [15, 0],
            color: "rgba(29,233,182,1)",
            show: true,
          },
        },
        itemStyle: {
          normal: {
            color: "rgba(29,233,182,1)",
            shadowBlur: 10,
            shadowColor: "rgba(51,51,3,1)",
          },
        },
        symbolSize: 12,
        data: componentProps.mapPointData.pointData,
        //     data: [
        //     { value: [118.8062, 31.9208], itemStyle: { color: "#4ab2e5" } },
        //     { value: [127.9688, 45.368], itemStyle: { color: "#4ab2e5" } },
        //     { value: [119.4543, 25.9222] },
        // ],
      }, //地图线的动画效果
      {
        type: "lines",
        zlevel: 2,
        effect: {
          show: true,
          period: 4, //箭头指向速度，值越小速度越快
          trailLength: 0.4, //特效尾迹长度[0,1]值越大，尾迹越长重
          symbol: "arrow", //箭头图标
          symbolSize: 7, //图标大小
        },
        lineStyle: {
          normal: {
            color: "rgba(222,155,6,1)",
            width: 1, //线条宽度
            opacity: 0.1, //尾迹线条透明度
            curveness: 0.3, //尾迹线条曲直度
          },
        },
        data: componentProps.mapPointData.mapData,
      },
    ],
  };
  componentProps.options = option;
  // 返回组件属性
  return componentProps;
}

// 组件创建前
async function defineComponentBeforeCreated({ VueElement }) {}

// 组件创建后
async function defineComponentCreated({ VueElement, VueInstance }) {}

async function handleDataCallback({ ResourceData, VueInstance }) {}
